<div id="JooseCB">
<script type="text/javascript" src="../lib/JooseX/IDE/ClassBrowser.js"></script>

  <style type="text/css">
  #JooseCB {
  	font-family: Arial;
  }
  #JooseCB th {
  	text-align: left;
  	width: 25%;
  	background-color: #99ccff;
  }
  
  #JooseCB select {
  	min-width: 100%
  }
  
  #JooseCB td {
  	background-color: #99ccff;
  }
  #JooseCBContainerTable {
  	width: 100%;
  }
  </style>
  <table id="JooseCBContainerTable" cellpadding=5 cellspacing=1>
    <tr>
      <th>Modules</th>
      <th>Classes and Roles</th>
      <th>Categories</th>
      <th>Elements</th>
    </tr>
    <tr>
      <td><select id="JooseCBModulesSelect" size=10     onchange="cb.selectedModule(this)"></select>
      <td><select id="JooseCBClassesSelect" size=10     onchange="cb.selectedClass(this)"></select>
      <td><select id="JooseCBCategoriesSelect" size=10  onchange="cb.selectedCategory(this)"></select>
      <td><select id="JooseCBElementsSelect" size=10    onchange="cb.selectedElement(this)"></select>
    </tr>
    <tr>
      <td id="JooseCBBody" colspan="4"></td>
    </tr>
  </table>
</div>